{include file="/public/header"}
<style>
    .example {
        height: 100%;
        position: relative;
    }
    .thumbnail {
        display: block;
        padding: 4px;
        margin-bottom: 17px;
        line-height: 1.42857143;
        background-color: #fff;
        border: 1px solid #ddd;
        border-radius: 4px;
        -webkit-transition: border 0.2s ease-in-out;
        -o-transition: border 0.2s ease-in-out;
        transition: border 0.2s ease-in-out;
    }
    .thumbnail .caption {
        padding: 9px;
        color: #333333;
    }
    .text-red {
        color: #e74c3c !important;
    }
    .ew-head-list-item {
        width: 22px;
        height: 22px;
        border-radius: 50%;
        border: 1px solid #fff;
        margin-left: -10px;
    }

    .mask{position:fixed;width:100%;height:100%;top:0;left:0;background:#000;opacity:0.8;filter:alpha(Opacity=80);-moz-opacity:0.8;z-index:999;display:none;}
    .loading{position:fixed;width:300px;left:50%;margin-left:-150px;top:200px;height:18px;border-radius:10px;background:#fff;z-index:9999;overflow:hidden;display:none;}
</style>
<div style="display: none"><a id="opentab" target="_blank"><div id="opentabclick">打开新标签</div></a></div>
<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form" id="formBasForm" lay-filter="formBasForm">
                <div class="layui-tab layui-tab-brief" lay-filter="notice">
                    <ul class="layui-tab-title">
                        <li class="layui-this"><i class="layui-icon layui-icon-website"></i>前台配置</li>
                        <li><i class="layui-icon layui-icon-username"></i>登陆模板</li>
                        <li><i class="layui-icon layui-icon-404"></i>维护模板</li>
                        <li><i class="layui-icon layui-icon-notice"></i>公告模板</li>
                        <li><i class="layui-icon layui-icon-set-sm"></i>模板配置</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <div class="layui-form-item">
                                <div class="layui-btn-container">
                                    <a onclick="uploadTemplate('home')" class="layui-btn layui-icon layui-icon-upload">上传模板</a>
                                    <a onclick="defaultTemplate('home')" class="layui-btn layui-btn-warm layui-icon layui-icon-template">一键还原</a>
                                    <a onclick="settingTemplate('home')" class="layui-btn layui-btn-primary layui-icon layui-icon-set-fill">模板配置</a>
                                </div>
                            </div>
                            <div class="layui-row layui-col-space10" style="float: left;width: 100%;">
                                {volist name="home_template_list" id="res"}
                                <div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
                                    <div class="thumbnail example">
                                        <div style="height:220px;">
                                            <img onclick="previewImg('/template/modules/home/{$res.name}/preview.png')" src="/template/modules/home/{$res.name}/preview.png" style="width:100%;object-fit: cover;display: block;height:220px;object-position: 50% 20%;" alt="V1模板">
                                        </div>
                                        <div class="caption">
                                            <h2 style="font-size: 18px;color: #333;margin-bottom: 10px;">{$res.title}&emsp;{eq name="res.is_use" value="1"}<span class="text-red">使用中</span>{/eq}<span class="pull-right">V {$res.version}</span></h2>
                                            <div class="layui-text" style="height: 44px;overflow: hidden;margin-bottom: 12px;">{$res.intro}</div>
                                            <div class="text-center">
                                                <!--如果需要响应编辑或删除事件，可以给元素添加 btn-edit或btn-del的类和data-id这个属性值-->
                                                <a onclick="saveTemplate('home','{$res.name}')" class="layui-btn layui-btn-sm layui-icon layui-icon-ok">使用</a>
                                                <a onclick="previewNotice('/?preview={$res.name}')" class="layui-btn layui-btn-sm layui-btn-warm layui-icon layui-icon-search">预览</a>
                                                <a onclick="deleteTemplate('home','{$res.name}')" class="layui-btn layui-btn-sm layui-btn-danger layui-icon layui-icon-delete">删除</a>
                                                <a onclick="packTemplate('home','{$res.name}')" class="layui-btn layui-btn-sm layui-btn-primary layui-icon layui-icon-download-circle">打包</a>
                                            </div>
                                            <div style="margin-top:20px;position: relative;color: #999;font-size: 12px;">
                                                {$res.author}
                                                <div style="position: absolute;right: 0;top: 0;">
                                                    <img class="ew-head-list-item" lay-tips="{$res.author}" lay-offset="0,-5px"
                                                         src="//q4.qlogo.cn/headimg_dl?dst_uin={$res.qq??2129876388}&spec=100"/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {/volist}
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-form-item">
                                <div class="layui-btn-container">
                                    <a onclick="uploadTemplate('login')" class="layui-btn layui-icon layui-icon-upload">上传模板</a>
                                    <a onclick="defaultTemplate('login')" class="layui-btn layui-btn-warm layui-icon layui-icon-template">一键还原</a>
                                    <a onclick="settingTemplate('login')" class="layui-btn layui-btn-primary layui-icon layui-icon-set-fill">模板配置</a>
                                </div>
                            </div>
                            <div class="layui-row layui-col-space10" style="float: left;width: 100%;">
                                {volist name="login_template_list" id="res"}
                                <div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
                                    <div class="thumbnail example">
                                        <div style="height:220px;">
                                            <img onclick="previewImg('/template/modules/login/{$res.name}/preview.png')" src="/template/modules/login/{$res.name}/preview.png" style="width:100%;object-fit: cover;display: block;height:220px;object-position: 50% 20%;" alt="V1模板">
                                        </div>
                                        <div class="caption">
                                            <h2 style="font-size: 18px;color: #333;margin-bottom: 10px;">{$res.title}&emsp;{eq name="res.is_use" value="1"}<span class="text-red">使用中</span>{/eq}<span class="pull-right">V {$res.version}</span></h2>
                                            <div class="layui-text" style="height: 44px;overflow: hidden;margin-bottom: 12px;">{$res.intro}</div>
                                            <div class="text-center">
                                                <!--如果需要响应编辑或删除事件，可以给元素添加 btn-edit或btn-del的类和data-id这个属性值-->
                                                <a onclick="saveTemplate('login','{$res.name}')" class="layui-btn layui-btn-sm layui-icon layui-icon-ok">使用</a>
                                                <a {eq name='preview' value='1'}href="/?preview={$res.name}&type=1"{else/}onclick="previewNotice()"{/eq} class="layui-btn layui-btn-sm layui-btn-warm layui-icon layui-icon-search" target="_blank">预览</a>
                                                <a onclick="deleteTemplate('login','{$res.name}')" class="layui-btn layui-btn-sm layui-btn-danger layui-icon layui-icon-delete">删除</a>
                                                <a onclick="packTemplate('login','{$res.name}')" class="layui-btn layui-btn-sm layui-btn-primary layui-icon layui-icon-download-circle">打包</a>
                                            </div>
                                            <div style="margin-top:20px;position: relative;color: #999;font-size: 12px;">
                                                {$res.author}
                                                <div style="position: absolute;right: 0;top: 0;">
                                                    <img class="ew-head-list-item" lay-tips="{$res.author}" lay-offset="0,-5px"
                                                         src="//q4.qlogo.cn/headimg_dl?dst_uin={$res.qq??2129876388}&spec=100"/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {/volist}
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-form-item">
                                <div class="layui-btn-container">
                                    <a onclick="uploadTemplate('maintain')" class="layui-btn layui-icon layui-icon-upload">上传模板</a>
                                    <a onclick="defaultTemplate('maintain')" class="layui-btn layui-btn-warm layui-icon layui-icon-template">一键还原</a>
                                    <a onclick="settingTemplate('maintain')" class="layui-btn layui-btn-primary layui-icon layui-icon-set-fill">模板配置</a>
                                </div>
                            </div>
                            <div class="layui-row layui-col-space10" style="float: left;width: 100%;">
                                {volist name="maintain_template_list" id="res"}
                                <div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
                                    <div class="thumbnail example">
                                        <div style="height:220px;">
                                            <img onclick="previewImg('/template/modules/maintain/{$res.name}/preview.png')" src="/template/modules/maintain/{$res.name}/preview.png" style="width:100%;object-fit: cover;display: block;height:220px;object-position: 50% 20%;" alt="V1模板">
                                        </div>
                                        <div class="caption">
                                            <h2 style="font-size: 18px;color: #333;margin-bottom: 10px;">{$res.title}&emsp;{eq name="res.is_use" value="1"}<span class="text-red">使用中</span>{/eq}<span class="pull-right">V {$res.version}</span></h2>
                                            <div class="layui-text" style="height: 44px;overflow: hidden;margin-bottom: 12px;">{$res.intro}</div>
                                            <div class="text-center">
                                                <!--如果需要响应编辑或删除事件，可以给元素添加 btn-edit或btn-del的类和data-id这个属性值-->
                                                <a onclick="saveTemplate('maintain','{$res.name}')" class="layui-btn layui-btn-sm layui-icon layui-icon-ok">使用</a>
                                                <a {eq name='preview' value='1'}href="/?preview={$res.name}&type=2"{else/}onclick="previewNotice()"{/eq} class="layui-btn layui-btn-sm layui-btn-warm layui-icon layui-icon-search" target="_blank">预览</a>
                                                <a onclick="deleteTemplate('maintain','{$res.name}')" class="layui-btn layui-btn-sm layui-btn-danger layui-icon layui-icon-delete">删除</a>
                                                <a onclick="packTemplate('maintain','{$res.name}')" class="layui-btn layui-btn-sm layui-btn-primary layui-icon layui-icon-download-circle">打包</a>
                                            </div>
                                            <div style="margin-top:20px;position: relative;color: #999;font-size: 12px;">
                                                {$res.author}
                                                <div style="position: absolute;right: 0;top: 0;">
                                                    <img class="ew-head-list-item" lay-tips="{$res.author}" lay-offset="0,-5px"
                                                         src="//q4.qlogo.cn/headimg_dl?dst_uin={$res.qq??2129876388}&spec=100"/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {/volist}
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-row layui-col-space10" style="float: left;width: 100%;">
                                <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
                                    <img onclick="previewImg('{__IMG__}logo.png')" src="{__IMG__}logo.png" width="50px"  border="0" />
                                    <br>
                                    <input type="radio" value="0" name="notice_template" title="自定义" lay-filter="notice_select" checked/>
                                </div>
                                {volist name="notice_template_list" id="res"}
                                <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
                                    <img onclick="previewImg('/template/modules/notice/{$res.name}/preview.png')" src="/template/modules/notice/{$res.name}/preview.png" width="80px"  border="0" />
                                    <br>
                                    <input type="radio" value="{$res.name}" name="notice_template" title="{$res.title}" lay-filter="notice_select" checked/>
                                </div>
                                {/volist}
                            </div>
                            <div id="notice" style="display: none">
                                <div id="notice_diy" style="display: none">
                                    <div class="layui-form-item layui-form-text">
                                        <label class="layui-form-label">自定义模板</label>
                                        <div class="layui-input-block">
                                            <textarea name="notice_diy" class="layui-input" placeholder="自定义公告模板" style="height:120px"></textarea>
                                            <div class="sf-tips">
                                                参数说明：[notice]代表公告内容，[cookie]代表创建cookie
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="notice_template" style="display: none">
                                    <div class="layui-form-item" pane>
                                        <label class="layui-form-label">图标</label>
                                        <div class="layui-input-block  inline-block">
                                            <input type="radio" value="-1" name="notice_icon" title="关闭" checked/>
                                            <input type="radio" value="0" name="notice_icon" title="<i class='sf-layer-ico' style='background-position: 0px 0'></i>"/>
                                            <input type="radio" value="1" name="notice_icon" title="<i class='sf-layer-ico' style='background-position: -30px 0'></i>"/>
                                            <input type="radio" value="2" name="notice_icon" title="<i class='sf-layer-ico' style='background-position: -60px 0'></i>"/>
                                            <input type="radio" value="3" name="notice_icon" title="<i class='sf-layer-ico' style='background-position: -90px 0'></i>"/>
                                            <input type="radio" value="4" name="notice_icon" title="<i class='sf-layer-ico' style='background-position: -120px 0'></i>"/>
                                            <input type="radio" value="5" name="notice_icon" title="<i class='sf-layer-ico' style='background-position: -150px 0'></i>"/>
                                            <input type="radio" value="6" name="notice_icon" title="<i class='sf-layer-ico' style='background-position: -180px 0'></i>"/>
                                        </div>
                                    </div>
                                    <div class="layui-form-item" pane>
                                        <label class="layui-form-label">弹出动画</label>
                                        <div class="layui-input-block  inline-block">
                                            <input type="radio" value="0" name="notice_anim" title="平滑放大" checked/>
                                            <input type="radio" value="1" name="notice_anim" title="从上掉落"/>
                                            <input type="radio" value="2" name="notice_anim" title="从最底部往上滑入"/>
                                            <input type="radio" value="3" name="notice_anim" title="从左滑入"/>
                                            <input type="radio" value="4" name="notice_anim" title="从左翻滚"/>
                                            <input type="radio" value="5" name="notice_anim" title="渐显"/>
                                            <input type="radio" value="6" name="notice_anim" title="抖动"/>
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">遮罩层</label>
                                        <div class="layui-input-block">
                                            <input type="number" name="notice_shade" class="layui-input" placeholder="0~1之间"/>
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">显示时长</label>
                                        <div class="layui-input-block">
                                            <input type="number" name="notice_time" class="layui-input" placeholder="自动关闭所需毫秒，0则代表不关闭"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-form-item">
                                <label class="layui-form-label">模板预览</label>
                                <div class="layui-input-block">
                                    <input type="checkbox" name="preview" value="1" lay-skin="switch" lay-tips="开启后可使用模板预览" lay-filter="preview" {eq name="preview" value="1"}checked{/eq}>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <hr style="width:0px">
            </form>
        </div>
    </div>
</div>
<script type="text/html" id="SF_TbUpload">
    <div class="layui-card">
        <div class="layui-card-body layui-form-pane">
            <form class="layui-form" method="post" action="">
                <input type="hidden" name="form_submit" value="ok" />
                <div class="layui-form-item text-center">
                    <input type="hidden" id="totalPage" value="0"/>
                    <input type="hidden" id="page" value="1"/>
                    <input type="hidden" id="status" value="0"/>
                    <div class="layui-upload-drag" id="fileUpload">
                        <i class="layui-icon layui-icon-upload-drag" style="color:#2d8cf0;"></i>
                        <p>点击上传，或将文件拖拽到此处</p>
                        <div class="layui-hide" id="uploadDemoView">
                            <hr>
                            <div class="layui-form-item">
                                <img src="" alt="上传成功后渲染" id="demo1" style="max-width: 196px">
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">文件名</label>
                                <div class="layui-input-block">
                                    <input type="text" name="name" id="name" value="" lay-verify="title" autocomplete="off" readonly="true" class="layui-input">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="mask"></div>
                <div class="loading">
                    <div class="layui-progress layui-progress-big" lay-showpercent="true" lay-filter="uploadProgress">
                        <div class="layui-progress-bar" lay-percent="0%"></div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</script>
<script type="text/html" id="SF_Setting">
    <form id="SF_EditForm" lay-filter="SF_EditForm" class="layui-form formBasForm layui-card-body"></form>
</script>
{include file="/public/footer"}
<script>
    layui.use(['element', 'layer', 'form', 'notice', 'upload', 'admin'], function () {
        var $ = layui.jquery;
        var element = layui.element;
        var layer = layui.layer;
        var form = layui.form;
        var notice = layui.notice;
        var upload = layui.upload;
        var admin = layui.admin;

        element.on('tab(notice)', function(data){
            if(data.index == 3){
                $("#notice").css("display","inherit");
            }else{
                $("#notice").css("display","none");
            }
        });

        window.previewNotice = function(url){
            if($('input[name="preview"]').is(':checked')){
                $('#opentab').attr('href',url);
                $('#opentabclick').click();
            }else{
                notice.msg('当前模板预览未开启，请开启后在使用！', {icon:3});
            }
        }

        window.saveTemplate = function(type, name){
            notice.msg('正在执行中..', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:url("/Set/editTemplate")}',
                data: {type:type, name:name},
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    if (data.code == 0) {
                        notice.msg(data.msg, {icon: 1, audio:'1'});
                    } else {
                        notice.msg(data.msg, {icon: 2, audio:'1'});
                    }
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
        }

        window.deleteTemplate = function(type, name){
            notice.msg('正在执行中..', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:url("/Set/deleteTemplate")}',
                data: {type:type, name:name},
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    if (data.code == 0) {
                        notice.msg(data.msg, {icon: 1, audio:'1'});
                    } else {
                        notice.msg(data.msg, {icon: 2, audio:'1'});
                    }
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
        }

        window.packTemplate = function(type, name){
            notice.msg('正在执行中..', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:url("/Set/package")}',
                data: {type:type, name:name},
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    if (data.code == 0) {
                        notice.msg(data.msg, {icon: 1, audio:'1'});
                        parent.layui.admin.confirm('确认要下载文件'+data.data+'吗？', {icon:3}, function (index) {
                            window.open('{:url("/Set/download")}?name='+data.data+'&type='+type);
                            parent.layer.close(index);
                        });
                    } else {
                        notice.msg(data.msg, {icon: 2, audio:'1'});
                    }
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
        }

        window.uploadTemplate = function(type){
            admin.open({
                title: '上传模板',
                type: 1,
                content: $('#SF_TbUpload').html(),
            });
            upload.render({
                elem: '#fileUpload',
                url: '{:url("/Upload/template")}', //处理上传文件接口
                accept: 'file',
                auto: false,
                acceptMime: '*.*',//允许上传的文件类型
                data: {type:type},
                choose: function (obj) {
                    element.progress('uploadProgress', '0%');
                    $('.mask').show();
                    $('.loading').show();
                    var data = this.data;
                    var files = obj.pushFile();
                    var LENGTH = 500 * 1024; //每片文件大小
                    obj.preview(function (index, file, result) {
                        var totalSize = file.size;
                        var totalPage = Math.ceil(totalSize / LENGTH);
                        $('#totalPage').val(totalPage);
                        $('#page').val('1');
                        $('#status').val('1');
                        var fileName = file.name;
                        $('#name').val(fileName);
                        var fileExt = fileName.substr(fileName.lastIndexOf('.') + 1);
                        fileName = fileName.substr(0, fileName.lastIndexOf('.'));
                        var progressTimer = setInterval(function () {
                            var totalPage = parseInt($('#totalPage').val());
                            var page = parseInt($('#page').val());
                            var status = $('#status').val();
                            if (parseInt(totalPage) == parseInt(page) && (parseInt(status) == 2 || parseInt(status) == -1)) {
                                clearInterval(progressTimer);
                            } else {
                                if (status == 1) {
                                    $('#status').val('0');
                                    data.fileName = fileName;
                                    data.page = page;
                                    data.totalPage = totalPage;
                                    data.fileExt = fileExt;
                                    obj.upload(index, file.slice((page - 1) * LENGTH, page * LENGTH));
                                }
                            }
                        }, 100);
                    });
                },
                done: function (res) {
                    if(res.code == 0) {
                        if (res.data.status == 1) { //分片上传
                            var page = parseInt($('#page').val());
                            var totalPage = parseInt($('#totalPage').val());
                            element.progress('uploadProgress', Math.ceil(page * 100 / totalPage) + '%');
                            page = page + 1;
                            console.log(page);
                            $('#page').val(page);
                            $('#status').val('1');
                        } else if (res.data.status == 2) { //上传完成
                            element.progress('uploadProgress', '100%');
                            $('#status').val('2');
                            $('#downUrl').val(res.data.downUrl);
                            layui.$('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', '{__MODULE__}fileChoose/img/zip.png');
                            notice.msg('安装成功', {icon: 1,audio: '1',onOpening: function () {
                                    $('.mask').hide();
                                    $('.loading').hide();}
                            });
                            layer.closeAll();
                        } else { //上传错误
                            $('#status').val('-1');
                            element.progress('uploadProgress', '0%');
                            console.log(!typeof (res.data.downUrl) == "undefined");
                            if (typeof (res.data.downUrl) == "undefined") {
                            } else {
                                $('#downUrl').val(res.data.downUrl);
                            }
                            notice.msg(res.msg, {icon: 2,audio: '1',onOpening: function () {
                                    $('.mask').hide();
                                    $('.loading').hide();}
                            });
                        }
                    }else{
                        $('#status').val('-1');
                        element.progress('uploadProgress', '0%');
                        console.log(!typeof (res.data.downUrl) == "undefined");
                        if (typeof (res.data.downUrl) == "undefined") {
                        } else {
                            $('#downUrl').val(res.data.downUrl);
                        }
                        notice.msg(res.msg, {icon: 2,audio: '1',onOpening: function () {
                                $('.mask').hide();
                                $('.loading').hide();}
                        });
                    }
                },
                error: function(){
                    notice.msg('服务器错误', {icon: 2,audio: '1',onOpening: function () {
                            $('.mask').hide();
                            $('.loading').hide();}
                    });
                    layer.closeAll();
                }
            });
        }

        window.defaultTemplate = function(type){
            notice.msg('正在执行中..', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:url("/Set/defaultTemplate")}',
                data: {type:type},
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    if (data.code == 0) {
                        notice.msg(data.msg, {icon: 1, audio:'1'});
                    } else {
                        notice.msg(data.msg, {icon: 2, audio:'1'});
                    }
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
        }

        window.settingTemplate = function(type){
            notice.msg('正在执行中..', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:url("/Set/settingTemplate")}',
                data: {type:type},
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    if (data.code == 0) {
                        if(Object.keys(data.data).length > 0){
                            notice.msg(data.msg, {icon: 1, audio:'1'});
                            admin.open({
                                title: '模板配置',
                                type: 1,
                                area: ['600px', '500px'],
                                content: $("#SF_Setting").html(),
                                btn: ['保存', '取消'],
                                maxmin: true,
                                resize: true,
                                fixed: true,
                                offset: 'auto',
                                success: function (layero, dIndex) {
                                    var html = '';
                                    $.each(data.data,function(index,value){
                                        html += '<div class="layui-form-item"><label class="layui-form-label">'+value.title+':</label><div class="layui-input-block">';
                                        switch(value.type){
                                            case 'string':
                                                html += '<input '+value.extend+' type="text" name="row['+value.name+']" value="'+value.value+'" class="layui-input" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+' lay-direction="1"/>';
                                                break;
                                            case 'text':
                                                html += '<textarea '+value.extend+' name="row['+value.name+']" class="layui-textarea" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+' row="5">'+value.value+'</textarea>';
                                                break;
                                            case 'array':
                                                html += '<div style="white-space:nowrap;overflow: scroll;">\n' +
                                                    '                        <table class="layui-table" id="addField'+value.name+'">\n' +
                                                    '                            <tr>\n' +
                                                    '                                <td style="min-width: 100px">\n' +
                                                    '                                    <input type="text" id="key'+value.name+'" class="layui-input" lay-tips="请输入键名"/>\n' +
                                                    '                                </td>\n' +
                                                    '                                <td style="min-width: 100px">\n' +
                                                    '                                    <input type="text" id="value'+value.name+'" class="layui-input" lay-tips="请输入键值"/>\n' +
                                                    '                                </td>\n' +
                                                    '                                <td>\n' +
                                                    '                                    <a class="layui-btn layui-btn-sm layui-icon layui-icon-add-1" onclick="AddField(\''+value.name+'\')"></a>\n' +
                                                    '                                </td>\n' +
                                                    '                            </tr>';
                                                var i = 0;
                                                $.each(value.value ,function(k,v){
                                                    html += '<tr id="tr'+value.name+i+'">\n' +
                                                        '                            <td style="min-width: 100px">\n' +
                                                        '                                <input '+value.extend+' type="text" name="row['+value.name+']['+i+'][key]" value="'+k+'" class="layui-input" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+' lay-direction="1"/>\n' +
                                                        '                            </td>\n' +
                                                        '                            <td style="min-width: 100px">\n' +
                                                        '                                <input '+value.extend+' type="text" name="row['+value.name+']['+i+'][value]" value="'+v+'" class="layui-input" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+' lay-direction="1"/>\n' +
                                                        '                            </td>\n' +
                                                        '                            <td>\n' +
                                                        '                                <a class="layui-btn layui-btn-sm layui-btn-danger layui-icon layui-icon-delete" onclick="DeleteField(\''+value.name+'\',\''+i+'\')"></a>\n' +
                                                        '                            </td>\n' +
                                                        '                            </tr>';
                                                    i++;
                                                });
                                                html += '</table></div>';
                                                break;
                                            case 'number':
                                                html += ' <input '+value.extend+' type="number" name="row['+value.name+']" value="'+value.value+'" class="layui-input"\n' +
                                                    '                               lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+'/>';
                                                break;
                                            case 'bool':
                                                html += '<input type="checkbox" name="row['+value.name+']" value="1" lay-skin="switch" '+(value.value?'checked':'')+' '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+'/>\n';
                                                break;
                                            case 'select':
                                                html += '<select '+value.extend+' class="layui-input" name="row['+value.name+']" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+'>\n';
                                                $.each(value.content ,function(key,vo){
                                                    html += '<option value="'+key+'" '+(key==value.value?'selected':'')+'>'+vo+'</option>';
                                                });
                                                html += '</select>';
                                                break;
                                            case 'checkbox':
                                                $.each(value.content ,function(key,vo){
                                                    html += '<input type="checkbox" name="row['+value.name+']" value="'+key+'" title="'+vo+'" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+' '+(key==value.value?'checked':'')+'>\n';
                                                });
                                                break;
                                            case 'image':
                                                html += '<input '+value.extend+' type="text" class="layui-input" name="row['+value.name+']" value="'+value.value+'" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+'>\n' +
                                                    '                        <div class="layui-form-item">\n' +
                                                    '                            <div class="layui-upload-drag" id="image'+value.name+'">\n' +
                                                    '                                <i class="layui-icon layui-icon-upload-drag" style="color:#2d8cf0;"></i>\n' +
                                                    '                                <p>点击上传，或将文件拖拽到此处</p>\n' +
                                                    '                                <div class="layui-hide" id="uploadImage'+value.name+'">\n' +
                                                    '                                    <hr>\n' +
                                                    '                                    <img src="" alt="上传成功后渲染" id="img'+value.name+'" style="max-width: 196px">\n' +
                                                    '                                </div>\n' +
                                                    '                            </div>\n' +
                                                    '                        </div>';
                                                html += '<script>\n' +
                                                    '                            layui.use([\'upload\',\'notice\'], function () {\n' +
                                                    '                                var $ = layui.jquery;\n' +
                                                    '                                var upload = layui.upload;\n' +
                                                    '                                var notice = layui.notice;\n' +
                                                    '\n' +
                                                    '                                upload.render({\n' +
                                                    '                                    elem: \'#image'+value.name+'\'\n' +
                                                    '                                    ,url: \'{:url("/Upload/image")}\'\n' +
                                                    '                                    ,before: function(obj){\n' +
                                                    '                                        //预读本地文件示例，不支持ie8\n' +
                                                    '                                        obj.preview(function(index, file, result){\n' +
                                                    '                                            $(\'#img'+value.name+'\').attr(\'src\', result); //图片链接（base64）\n' +
                                                    '                                        });\n' +
                                                    '                                        notice.msg(\'上传中...\', {icon: 4, close: true});\n' +
                                                    '                                    }\n' +
                                                    '                                    ,done: function(res){\n' +
                                                    '                                        notice.destroy();\n' +
                                                    '                                        if(res.code == 0){\n' +
                                                    '                                            notice.msg(\'上传成功！\', {icon: 1, audio:\'1\'});\n' +
                                                    '                                            $("input[name=\'row['+value.name+']\']").val(res.data.path);\n' +
                                                    '                                            layui.$(\'#uploadImage'+value.name+'\').removeClass(\'layui-hide\').find(\'img\').attr(\'src\', res.files.file);\n' +
                                                    '                                        }else{\n' +
                                                    '                                            notice.msg(\'上传失败！\', {icon: 2, audio:\'1\'});\n' +
                                                    '                                        }\n' +
                                                    '                                    }\n' +
                                                    '                                });\n' +
                                                    '                            });\n' +
                                                    '                        <\/script>';
                                                break;
                                            case 'file':
                                                html += '<style>\n' +
                                                    '                            .mask{position:fixed;width:100%;height:100%;top:0;left:0;background:#000;opacity:0.8;filter:alpha(Opacity=80);-moz-opacity:0.8;z-index:999;display:none;}\n' +
                                                    '                            .loading{position:fixed;width:300px;left:50%;margin-left:-150px;top:200px;height:18px;border-radius:10px;background:#fff;z-index:9999;overflow:hidden;display:none;}\n' +
                                                    '                        </style>\n' +
                                                    '                        <input '+value.extend+' type="text" class="layui-input" name="row['+value.name+']" value="'+value.value+'" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+'>\n' +
                                                    '                        <div class="layui-form-item text-center">\n' +
                                                    '                            <input type="hidden" id="totalPage" value="0"/>\n' +
                                                    '                            <input type="hidden" id="page" value="1"/>\n' +
                                                    '                            <input type="hidden" id="status" value="0"/>\n' +
                                                    '                            <div class="layui-upload-drag" id="fileUpload'+value.name+'">\n' +
                                                    '                                <i class="layui-icon layui-icon-upload-drag" style="color:#2d8cf0;"></i>\n' +
                                                    '                                <p>点击上传，或将文件拖拽到此处</p>\n' +
                                                    '                                <div class="layui-hide" id="uploadFile'+value.name+'">\n' +
                                                    '                                    <hr>\n' +
                                                    '                                    <div class="layui-form-item">\n' +
                                                    '                                        <img src="" alt="上传成功后渲染" id="fileImg'+value.name+'" style="max-width: 196px">\n' +
                                                    '                                    </div>\n' +
                                                    '                                    <div class="layui-form-item">\n' +
                                                    '                                        <label class="layui-form-label">文件名</label>\n' +
                                                    '                                        <div class="layui-input-block">\n' +
                                                    '                                            <input type="text" name="name" id="name" value="" lay-verify="title" autocomplete="off" readonly="true" class="layui-input">\n' +
                                                    '                                        </div>\n' +
                                                    '                                    </div>\n' +
                                                    '                                </div>\n' +
                                                    '                            </div>\n' +
                                                    '                        </div>\n' +
                                                    '                        <div class="layui-form-item text-center">\n' +
                                                    '                            <button type="button" class="layui-btn layui-btn-primary" lay-submit lay-filter="SF_DeleteFile"><i class="layui-icon">&#xe640;</i>删除</button>\n' +
                                                    '                        </div>\n' +
                                                    '                        <div class="mask"></div>\n' +
                                                    '                        <div class="loading">\n' +
                                                    '                            <div class="layui-progress layui-progress-big" lay-showpercent="true" lay-filter="uploadProgress'+value.name+'">\n' +
                                                    '                                <div class="layui-progress-bar" lay-percent="0%"></div>\n' +
                                                    '                            </div>\n' +
                                                    '                        </div>\n' +
                                                    '                        <script>\n' +
                                                    '                            layui.use([\'upload\', \'notice\', \'element\'], function () {\n' +
                                                    '                                var $ = layui.jquery;\n' +
                                                    '                                var upload = layui.upload;\n' +
                                                    '                                var notice = layui.notice;\n' +
                                                    '                                var element = layui.element;\n' +
                                                    '\n' +
                                                    '                                upload.render({\n' +
                                                    '                                    elem: \'#fileUpload'+value.name+'\',\n' +
                                                    '                                    url: \''+value.upload.upload.url+'\', //处理上传文件接口\n' +
                                                    '                                    accept: \'file\',\n' +
                                                    '                                    auto: false,\n' +
                                                    '                                    acceptMime: \'*.*\',//允许上传的文件类型\n' +
                                                    '                                    choose: function (obj) {\n' +
                                                    '                                        element.progress(\'uploadProgress'+value.name+'\', \'0%\');\n' +
                                                    '                                        $(\'.mask\').show();\n' +
                                                    '                                        $(\'.loading\').show();\n' +
                                                    '                                        var data = this.data;\n' +
                                                    '                                        var files = obj.pushFile();\n' +
                                                    '                                        var LENGTH = 500 * 1024; //每片文件大小\n' +
                                                    '                                        obj.preview(function (index, file, result) {\n' +
                                                    '                                            var totalSize = file.size;\n' +
                                                    '                                            var totalPage = Math.ceil(totalSize / LENGTH);\n' +
                                                    '                                            $(\'#totalPage\').val(totalPage);\n' +
                                                    '                                            $(\'#page\').val(\'1\');\n' +
                                                    '                                            $(\'#status\').val(\'1\');\n' +
                                                    '                                            var fileName = file.name;\n' +
                                                    '                                            $(\'#name\').val(fileName);\n' +
                                                    '                                            var fileExt = fileName.substr(fileName.lastIndexOf(\'.\') + 1);\n' +
                                                    '                                            fileName = fileName.substr(0, fileName.lastIndexOf(\'.\'));\n' +
                                                    '                                            var progressTimer = setInterval(function () {\n' +
                                                    '                                                var totalPage = parseInt($(\'#totalPage\').val());\n' +
                                                    '                                                var page = parseInt($(\'#page\').val());\n' +
                                                    '                                                var status = $(\'#status\').val();\n' +
                                                    '                                                if (parseInt(totalPage) == parseInt(page) && (parseInt(status) == 2 || parseInt(status) == -1)) {\n' +
                                                    '                                                    clearInterval(progressTimer);\n' +
                                                    '                                                } else {\n' +
                                                    '                                                    if (status == 1) {\n' +
                                                    '                                                        $(\'#status\').val(\'0\');\n' +
                                                    '                                                        data.fileName = fileName;\n' +
                                                    '                                                        data.page = page;\n' +
                                                    '                                                        data.totalPage = totalPage;\n' +
                                                    '                                                        data.fileExt = fileExt;\n' +
                                                    '                                                        obj.upload(index, file.slice((page - 1) * LENGTH, page * LENGTH));\n' +
                                                    '                                                    }\n' +
                                                    '                                                }\n' +
                                                    '                                            }, 100);\n' +
                                                    '                                        });\n' +
                                                    '                                    },\n' +
                                                    '                                    done: function (res) {\n' +
                                                    '                                        if(res.code == 0) {\n' +
                                                    '                                            if (res.data.status == 1) { //分片上传\n' +
                                                    '                                                var page = parseInt($(\'#page\').val());\n' +
                                                    '                                                var totalPage = parseInt($(\'#totalPage\').val());\n' +
                                                    '                                                element.progress(\'uploadProgress'+value.name+'\', Math.ceil(page * 100 / totalPage) + \'%\');\n' +
                                                    '                                                page = page + 1;\n' +
                                                    '                                                console.log(page);\n' +
                                                    '                                                $(\'#page\').val(page);\n' +
                                                    '                                                $(\'#status\').val(\'1\');\n' +
                                                    '                                            } else if (res.data.status == 2) { //上传完成\n' +
                                                    '                                                element.progress(\'uploadProgress'+value.name+'\', \'100%\');\n' +
                                                    '                                                $(\'#status\').val(\'2\');\n' +
                                                    '                                                $(\'#downUrl\').val(res.data.downUrl);\n' +
                                                    '                                                layui.$(\'#uploadFile'+value.name+'\').removeClass(\'layui-hide\').find(\'img\').attr(\'src\', \'{__MODULE__}fileChoose/img/file.png\');\n' +
                                                    '                                                notice.msg(\'上传成功\', {icon: 1,audio: \'1\',onOpening: function () {\n' +
                                                    '                                                        $(\'.mask\').hide();\n' +
                                                    '                                                        $(\'.loading\').hide();}\n' +
                                                    '                                                });\n' +
                                                    '                                            } else { //上传错误\n' +
                                                    '                                                $(\'#status\').val(\'-1\');\n' +
                                                    '                                                element.progress(\'uploadProgress'+value.name+'\', \'0%\');\n' +
                                                    '                                                console.log(!typeof (res.data.downUrl) == "undefined");\n' +
                                                    '                                                if (typeof (res.data.downUrl) == "undefined") {\n' +
                                                    '                                                } else {\n' +
                                                    '                                                    $(\'#downUrl\').val(res.data.downUrl);\n' +
                                                    '                                                }\n' +
                                                    '                                                notice.msg(res.msg, {icon: 2,audio: \'1\',onOpening: function () {\n' +
                                                    '                                                        $(\'.mask\').hide();\n' +
                                                    '                                                        $(\'.loading\').hide();}\n' +
                                                    '                                                });\n' +
                                                    '                                            }\n' +
                                                    '                                        }else{\n' +
                                                    '                                            $(\'#status\').val(\'-1\');\n' +
                                                    '                                            element.progress(\'uploadProgress'+value.name+'\', \'0%\');\n' +
                                                    '                                            console.log(!typeof (res.data.downUrl) == "undefined");\n' +
                                                    '                                            if (typeof (res.data.downUrl) == "undefined") {\n' +
                                                    '                                            } else {\n' +
                                                    '                                                $(\'#downUrl\').val(res.data.downUrl);\n' +
                                                    '                                            }\n' +
                                                    '                                            notice.msg(res.msg, {icon: 2,audio: \'1\',onOpening: function () {\n' +
                                                    '                                                    $(\'.mask\').hide();\n' +
                                                    '                                                    $(\'.loading\').hide();}\n' +
                                                    '                                            });\n' +
                                                    '                                        }\n' +
                                                    '                                    },\n' +
                                                    '                                    error: function(){\n' +
                                                    '                                        notice.msg(\'服务器错误\', {icon: 2,audio: \'1\',onOpening: function () {\n' +
                                                    '                                                $(\'.mask\').hide();\n' +
                                                    '                                                $(\'.loading\').hide();}\n' +
                                                    '                                        });\n' +
                                                    '                                    }\n' +
                                                    '                                });\n' +
                                                    '                                form.on(\'submit(SF_DeleteFile'+value.name+')\', function () {\n' +
                                                    '                                    notice.msg(\'正在执行中...\', {icon: 4, close: true});\n' +
                                                    '                                    $.ajax({\n' +
                                                    '                                        type: "POST",\n' +
                                                    '                                        url: \''+value.upload.delete.url+'\',\n' +
                                                    '                                        data: {file:$("input[name=\'row['+value.name+']\']").val()},\n' +
                                                    '                                        dataType: "json",\n' +
                                                    '                                        success: function(data) {\n' +
                                                    '                                            notice.destroy();\n' +
                                                    '                                            if (data.code == 0) {\n' +
                                                    '                                                notice.msg(data.msg, {icon: 1, audio:\'1\'});\n' +
                                                    '                                                layui.$(\'#uploadFile'+value.name+'\').addClass(\'layui-hide\');\n' +
                                                    '                                            } else {\n' +
                                                    '                                                notice.msg(data.msg, {icon: 2, audio:\'1\'});\n' +
                                                    '                                            }\n' +
                                                    '                                        },\n' +
                                                    '                                        error: function() {\n' +
                                                    '                                            notice.destroy();\n' +
                                                    '                                            notice.msg("服务器错误！", {icon: 2, audio:\'1\'});\n' +
                                                    '                                        }\n' +
                                                    '                                    });\n' +
                                                    '                                });\n' +
                                                    '                            });\n' +
                                                    '                        <\/script>';
                                                break;
                                            case 'radio':
                                                $.each(value.content ,function(key,vo){
                                                    html += '<input type="radio" name="row['+value.name+']" value="'+key+'" title="'+vo+'" lay-verType="tips" lay-verify="'+value.rule+'" '+(value.tip == ''?'':'lay-tips="'+value.tip+'"')+' '+(key==value.value?'checked':'')+'>\n';
                                                });
                                                break;
                                        }
                                        html += '</div></div>';
                                    });
                                    $('#SF_EditForm').html(html);
                                    form.render();
                                    window.DeleteField = function (id, num) {
                                        var tr = $('#tr' + id + num);
                                        tr.remove();

                                    }
                                    window.AddField = function (id) {
                                        var key = $('#key' + id).val();
                                        var value = $('#value' + id).val();
                                        var length = new Date().valueOf();
                                        if (key == '') {
                                            notice.msg('请填写键名！', {icon: 2});
                                            return false;
                                        }
                                        if (value == '') {
                                            notice.msg('请填写键值！', {icon: 2});
                                            return false;
                                        }
                                        $('#addField' + id).append('<tr id="tr' + id + length + '"><td><input type="text" name="row[' + id + '][' + length + '][key]" value="' + key + '" class="layui-input"/></td><td><input type="text" name="row[' + id + '][' + length + '][value]" value="' + value + '" class="layui-input"/></td><td><a class="layui-btn layui-btn-sm layui-btn-danger layui-icon layui-icon-delete" onclick="DeleteField(\'' + id + '\',\'' + length + '\')"></a></td></tr>');
                                        $('#key' + id).val('');
                                        $('#value' + id).val('');
                                    }
                                    admin.modelForm(layero, 'submitBtn', 'SF_EditForm');
                                    form.on('submit(submitBtn)', function (data) {
                                        notice.msg('正在执行中..', {icon: 4, close: true});
                                        data.field.type = type;
                                        $.ajax({
                                            type: "POST",
                                            url: '{:url("/Set/settingTemplate")}',
                                            data: data.field,
                                            dataType: "json",
                                            success: function(data) {
                                                notice.destroy();
                                                if (data.code == 0) {
                                                    notice.msg(data.msg, {icon: 1, audio:'1'});
                                                } else {
                                                    notice.msg(data.msg, {icon: 2, audio:'1'});
                                                }
                                            },
                                            error: function() {
                                                notice.destroy();
                                                notice.msg("服务器错误！", {icon: 2, audio:'1'});
                                            }
                                        });
                                        return false;
                                    });
                                }
                            });
                        }else{
                            notice.msg('该模板无需配置', {icon:3, audio:'1'});
                        }
                    } else {
                        notice.msg(data.msg, {icon: 2, audio:'1'});
                    }
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
        }

        form.on('radio(notice_select)', function (data) {
            if(data.value == 0){
                $("#notice_diy").css("display","inherit");
                $("#notice_template").css("display","none");
            }else{
                $("#notice_diy").css("display","none");
                $("#notice_template").css("display","inherit");
            }
            form.render('radio');
        });

        form.on('switch(preview)', function (data) {
            notice.msg('正在执行中..', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:url("/Set/previewTemplate")}',
                data: {value:data.elem.checked ? 1 : 0},
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    if (data.code == 0) {
                        notice.msg(data.msg, {icon: 1, audio:'1'});
                    } else {
                        notice.msg(data.msg, {icon: 2, audio:'1'});
                    }
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
        });

        // 表单提交事件
        window.previewImg = function (src) {
            layer.photos({ photos: { "data": [{ "src": src }] } });
        }
    });
</script>